import { history, useModel } from "@umijs/max"
import { Button, Card, Input, message } from "antd"
import { useState } from "react"
import AccountForm from "./AccountForm"

const UserinfoManager: React.FC = () => {
  const [activateCode, setActivateCode] = useState("")
  const { callPy } = useModel("websocketModel")
  const lockDevice = async () => {
    const args = [activateCode]
    const response = await callPy("st", "lock_device_from_web", args)
    if (response.state) {
      message.success("锁机成功")
      // 锁机成功之后,重定向到首页produce,使用history
      history.push("/produce")
    } else {
      message.error("锁机失败: " + response.info)
    }
  }
  return (
    <Card
      title="账户信息"
      extra={
        <>
          <Input
            placeholder="请输入锁机密码"
            value={activateCode}
            onChange={(e) => setActivateCode(e.target.value)}
            style={{ width: 200, marginRight: 8 }}
          />
          <Button type="primary" onClick={lockDevice}>
            锁机
          </Button>
        </>
      }
    >
      <AccountForm />
    </Card>
  )
}

export default UserinfoManager
